<template>
  <div class="main-main readonly">
    <el-container style="height: 100%;" v-loading="loading">
      <el-main>
        <el-row style="margin-bottom:20px">
          <el-col :span="24">
            <el-button size="medium" type="success" plain @click="add()">新增</el-button>
          </el-col>
        </el-row>
        <el-table :data="tableData" style="width: 100%;border:1px solid #ccc;" height="80%">
          <el-table-column label="序号" align="center">
            <template slot-scope="scope">
              <span>{{scope.$index + 1}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="bd_id" label="标段" align="center" :formatter="formatter"></el-table-column>
          <el-table-column prop="jcrq" label="进场日期" align="center"></el-table-column>
        </el-table>
      </el-main>
    </el-container>
    <Kdialog
      :dialogFormVisible1="dialogFormVisible1"
      @close="close1"
      :item="item"
      :BdData="BdData"
    />
  </div>
</template>

<script>
import Kdialog from "./dialog/Kdialog";
export default {
  components: {
    Kdialog
  },
  data() {
    return {
      dialogFormVisible1: false,
      selectData: [],
      tableData: [],
      loading: false,
      item: {},
      BdData: []
    };
  },
  methods: {
    edit(item) {
      this.dialogFormVisible1 = !this.dialogFormVisible1;
      this.item = item;
    },
    look(item) {
      this.dialogFormVisible1 = !this.dialogFormVisible1;
      this.item = item;
    },
    add() {
      this.dialogFormVisible1 = !this.dialogFormVisible1;
      this.item = {};
    },
    close1() {
      this.dialogFormVisible1 = false;
      this.search();
      this.searchBd();
    },
    formatter(row) {
      let vv;
      this.BdData.forEach(v => {
        if (v.id == row.bd_id) {
          vv = v.bdmc;
        }
      });
      return vv;
    },
    // del() {
    //   this.$confirm("此操作将永久删除该数据, 是否继续?", "提示", {
    //     confirmButtonText: "确定",
    //     cancelButtonText: "取消",
    //     type: "warning"
    //   })
    //     .then(() => {
    //       this.selectData.forEach(v => {
    //         this.$post("/api/QqSgjc/deletes", { id: v.id }).then(res => {
    //           if (res.code == 200) {
    //             this.$message({
    //               message: res.msg,
    //               type: "success"
    //             });
    //             this.search();
    //           } else {
    //             this.$message({
    //               message: res.msg,
    //               type: "error"
    //             });
    //           }
    //         });
    //       });
    //     })
    //     .catch(() => {
    //       this.$message({
    //         type: "info",
    //         message: "已取消删除"
    //       });
    //     });
    // },
    handleSelectionChange(value) {
      this.selectData = value;
    },
    search() {
      this.loading = true;
      this.$get("/api/QqSgjc/index", { xm_id: this.xm_id }).then(res => {
        if (res.code == 200 && res.data) {
          this.tableData = res.data;
        }
        this.loading = false;
      });
    },
    searchBd() {
      this.$get("/api/QqBdgl/index", { xm_id: this.xm_id }).then(res => {
        if (res.code == 200 && res.data) {
          this.BdData = res.data;
        }
      });
    }
  },
  computed: {
    xm_id() {
      return this.$route.query.xm_id || this.$route.params.xm_id;
    },
    xmmc() {
      return this.$route.query.xmmc;
    }
  },
  mounted() {
    this.search();
    this.searchBd();
  },
  watch: {
    xm_id() {
      this.search();
      this.searchBd();
    }
  }
};
</script>

<style scoped lang="less">
.main-main {
  width: 100%;
  height: calc(100% - 54px);
  .click {
    width: 100px;
    height: 100px;
    background: #ccc;
    cursor: pointer;
    position: absolute;
    right: 0;
    &:hover {
      border: 1px dashed #4098ff;
    }
  }
  .line {
    width: 2px;
    height: calc(100% - 40px);
    position: absolute;
    background: #ccc;
    bottom: 0;
    left: 20px;
  }
}
</style>